html {
	font-size: 14px;
}

.Page {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.Page>.body {
	position: relative;
	flex: 1;
}

#app .modal-header {
	padding: .6rem 1rem;
	background-color: #f4f4f4;
}

#app .modal-header .modal-title {
	color: inherit;
	font-size: 1rem;
}

#app .modal-header .close {
	color: black !important;
}

body {
	width: 100%;
	/*桌面端150%显示会出现占不满的情况, crx的宽度由下面style强行指定*/
	height: 450px;
	overflow: hidden;
}

#app.with-border {
	/*border: 1px solid #424D5A; !*win下无框窗口完全没有边框很难看*!*/
}

#app.loading> :not(.fullscreen-spinner) {
	filter: blur(3px);
}

li[data-v-4e4588ba] {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis
}

li .icon[data-v-4e4588ba] {
	max-width: 16px
}

[class*=hint--][aria-label]:after {
	white-space: pre
}

.HealthField .health {
	cursor: help
}

.health-overlay[data-v-1] {
	position: absolute;
	width: 100%;
	height: 90px;
	background: linear-gradient(180deg, #ececec 0, #fff)
}

.health-overlay.health3[data-v-1] {
	background: linear-gradient(180deg, #e6f2ff 0, #fff)
}

.health-overlay.health2[data-v-1] {
	background: linear-gradient(180deg, #ebfee8 0, #fff)
}

.health-overlay.health1[data-v-1] {
	background: linear-gradient(180deg, #fff1d8 0, #fff)
}

.health-overlay.health0[data-v-1] {
	background: linear-gradient(180deg, #ffe6e6 0, #fff)
}

.top-bar[data-v-1] {
	position: relative;
	padding: 0 4px
}

.top-bar a[data-v-1] {
	color: #148afb;
	line-height: 30px
}

.top-bar a i[data-v-1] {
	font-size: 1rem
}

.top-bar a[data-v-1]:hover {
	color: #5faffc
}

.top-bar .health[data-v-1] {
	float: right;
	margin-right: 8px;
	transform: translateY(10px)
}

.rules[data-v-1] {
	line-height: 30px;
	height: 15.6rem;
	padding-top: 2rem
}

.mode-title[data-v-1] {
	position: relative;
	text-align: center
}

.mode-title h3[data-v-1] {
	height: 2rem;
	line-height: 2rem;
	font-size: 1.42rem
}

.mode-title h3 span[data-v-1] {
	display: inline-block;
	overflow: hidden;
	max-width: 180px;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size: 1.42rem
}

.mode-title h3 i[data-v-1] {
	display: inline-block;
	padding-top: 3px;
	transform: translateY(-6px);
	text-align: left;
	font-size: 1.2rem
}

.mode-title h3 img[data-v-1] {
	width: 16px;
	transform: translate(3px, -7px)
}

.mode-title .blocked-domains-popover[data-v-1] {
	position: absolute;
	z-index: 1;
	right: 20px;
	left: 20px;
	border: 1px solid #e4e4e4;
	border-radius: 4px;
	background-color: #fff;
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, .15);
	font-size: 80%
}

.mode-title .blocked-domains-popover>.arrow[data-v-1] {
	position: absolute;
	top: -6px;
	left: calc(50% - 5px);
	display: block;
	width: 10px;
	height: 10px;
	transform: rotate(45deg);
	border-width: 1px 0 0 1px;
	border-style: solid;
	border-color: #e4e4e4;
	background-color: #f5f5f5
}

.mode-title .blocked-domains-popover>.header[data-v-1] {
	color: #868e96;
	border-radius: 4px 4px 0 0;
	background-color: #f5f5f5;
	line-height: 2em
}

.mode-title .blocked-domains-popover>.body ul[data-v-1] {
	overflow-y: auto;
	max-height: 120px;
	margin: 0;
	padding: 0;
	list-style-type: none;
	border-bottom: 1px solid #e4e4e4
}

.mode-title .blocked-domains-popover>.body ul li[data-v-1] {
	padding: 7px 10px;
	text-align: left
}

.mode-title .blocked-domains-popover>.body ul li[data-v-1]:not(:last-child) {
	border-bottom: 1px solid #e4e4e4
}

.mode-title .blocked-domains-popover>.body .buttons[data-v-1] {
	display: flex;
	flex-direction: row;
	padding: 7px 10px
}

.mode-title .blocked-domains-popover>.body .buttons button[data-v-1] {
	flex: 1;
	font-size: 80%;
	line-height: 1.2em
}

.mode-title .blocked-domains-popover>.body .buttons button[data-v-1]:not(:last-child) {
	margin-right: 10px
}

@keyframes buttonblink-data-v-1 {
	0% {
		box-shadow: 0 0 1rem 0 #e5701f;
		filter: saturate(100%)
	}

	50% {
		box-shadow: 0 0 .2rem 0 #e5701f;
		filter: saturate(70%)
	}

	to {
		box-shadow: 0 0 1rem 0 #e5701f;
		filter: saturate(100%)
	}
}

.mode-toggle .btn-group[data-v-1] {
	padding: .12rem
}

.mode-toggle .btn-group.border[data-v-1] {
	border-width: 2px !important;
	border-radius: 20px
}

.mode-toggle .btn-group .btn[data-v-1] {
	width: 7.14rem;
	padding: .55rem 0;
	font-size: .928rem
}

.mode-toggle .btn-group .btn[data-v-1]:first-child {
	margin-right: 3px
}

.mode-toggle .btn-group .btn[data-v-1]:disabled {
	opacity: 1
}

.mode-toggle .btn-group .btn.btn-outline-primary[data-v-1] {
	transition: none;
	border: 0 solid transparent
}

.mode-toggle .btn-group .btn.btn-outline-primary[data-v-1]:active,
.mode-toggle .btn-group .btn.btn-outline-primary[data-v-1]:focus,
.mode-toggle .btn-group .btn.btn-outline-primary[data-v-1]:hover {
	border-radius: 20px;
	color: #148afb;
	background-color: #f4f4f4;
	box-shadow: none
}

.mode-toggle .btn-group .btn.btn-primary[data-v-1] {
	border-radius: 20px
}

.mode-toggle .btn-group .btn.btn-primary[data-v-1]:active,
.mode-toggle .btn-group .btn.btn-primary[data-v-1]:focus,
.mode-toggle .btn-group .btn.btn-primary[data-v-1]:hover {
	box-shadow: none
}

.mode-toggle .cb-Always[data-v-1] {
	margin-top: 1.3rem
}

.mode-toggle .cb-Always label[data-v-1] {
	cursor: pointer;
	transform: translateY(-2px);
	font-size: .928rem
}

.StatusBar {
	position: relative;
	height: 30px;
	border-top: 1px solid #eef6ff;
	font-size: 80%;
	font-weight: 100;
	line-height: 29px
}

.StatusBar,
.StatusBar a {
	color: #868e96
}

.StatusBar .home {
	position: absolute;
	left: 10px
}

.StatusBar .version {
	text-align: center
}

.StatusBar a.feedback {
	position: absolute;
	right: 10px;
	cursor: pointer
}

.StatusBar a.feedback:focus {
	outline: none
}

.StatusBar a.feedback i {
	font-size: 1rem
}

.StatusBar #feedback-modal {
	font-size: 1rem;
	font-weight: 400
}